<template>
  <div id="app">
    <h1>{{ msg }}</h1>

    <h3>从“字符串”上传对象</h3>

    bucketName：
    <el-input style="width: auto"
              placeholder="请输入桶名称"
              v-model="bucketName"
              clearable>
    </el-input>

    objectName:
    <el-input style="width: auto"
              placeholder="请输入对象名称"
              v-model="objectName"
              clearable>
    </el-input>

    objectContent:
    <el-input style="width: auto"
              placeholder="请输入桶名称"
              v-model="objectContent"
              clearable>
    </el-input>

    <p></p>
    <el-row>
      <el-button type="primary" @click="submit1()">上传对象</el-button>
      <el-button type="primary" @click="submit2()">获取对象内容</el-button>
      <el-button type="primary" @click="submit3()">获取对象元数据</el-button>
      <el-button type="primary" @click="submit4()">删除对象</el-button>
    </el-row>

    <p></p>
    <p>{{data}}</p>

  </div>
</template>

<script>


  var OSS = require("oss-js-client");

  var ossClient = new OSS.Client({
    // endPoint: "192.168.1.40",
    endPoint: "127.0.0.1",
    port: 9000,
    useSSL: false,
    accessKey: "username",
    secretKey: "password",
  });

  export default {
    name: "VueOSSObject",
    data() {
      return {
        bucketName: "mybucket2",
        objectName: "a.txt",
        objectContent: "a-Content",
        data: '',
        msg: "演示OSSClient-Object操作",
      };
    },
    methods: {

      submit1: function () {

        //上传字符串或Buffer对象类型
        var buffer = this.objectContent;
        var metaData = {
          'Content-Type': 'text/plain', //需要设置类型
        };
        ossClient.putObject(this.bucketName, this.objectName, buffer, 0, /*metaData,*/ function (err, etag) {
          return console.log(err, etag) // err should be null, tag 默是MD5
        })
      },

      submit2: function () {

        //获取对象内容
        var size = 0;
        var data = '';
        ossClient.getObject(this.bucketName, this.objectName, (err, dataStream) => {
          if (err) {
            return console.log(err)
          }

          dataStream.on('data', (chunk) => {
            size += chunk.length;
            data += chunk;
          });
          dataStream.on('end', () => {
            //获取结果数据
            console.log('End. Total size = ' + size);
            console.log("End. Total data= " + data);
            this.data = data;
          });
          dataStream.on('error', (err) => {
            console.log(err)
          })
        });
      },

      submit3: function () {

        //获取对象的元数据
        ossClient.statObject(this.bucketName, this.objectName, (err, stat) => {
          if (err) {
            return console.log(err)
          }
          console.log(JSON.stringify(stat));
          this.data = JSON.stringify(stat);
        });
      },

      submit4: function () {

        //删除一个对象
        ossClient.removeObject(this.bucketName, this.objectName, function (err) {
          if (err) {
            return console.log('Unable to remove object', err)
          }
          console.log('Removed the object success !')
        });
      },

    }
  };
</script>

<style scope>
</style>
